
<template>
    <div class="index">
        <Spin fix v-if="spinShow">
            <Icon type="load-a" size=24 class="demo-spin-icon-load"></Icon>
            <div>Loading</div>
        </Spin>
        <div v-html="to_json(logInfo)"></div>
    </div>
</template>
<script>
export default {
    data(){
        return{
            spinShow:true,
            logInfo:'',
            infoid:this.$route.params.infoid,
            secretkey:this.$route.params.secretkey
        }
    },
    components: {},
    created(){
        this.getInfo()
    },
    methods: {
        getInfo(){
            this.$ajax('get_log_info',{id:this.infoid,secretkey:this.secretkey},(res)=>{
                console.log('loginfo:',res.data.data)
                this.logInfo = res.data.data;
                this.spinShow = false;
            },(error)=>{})
        },
        to_json(data){
            console.log('30 jsonobj',data);
            let json_str=JSON.stringify(data, null, "<br>");
            console.log('32 json_str',json_str);
            return json_str;
        },
    }
};
</script>
<style scoped>
.index{
    padding: 30px;
    line-height: 24px;
    font-size: 16px;
    word-wrap:break-word;
}
.demo-spin-icon-load{
    animation: ani-demo-spin 1s linear infinite;
}
@keyframes ani-demo-spin {
    from { transform: rotate(0deg);}
    50%  { transform: rotate(180deg);}
    to   { transform: rotate(360deg);}
}
.demo-spin-col{
    height: 100px;
    position: relative;
    border: 1px solid #eee;
}
</style>